Page({
  /**
   * 页面的初始数据
   */
  data: {
    cySuggestionShow:false,//控制输入提示的显示
    scale: 13,
    cyMarkers:"",
    startlatitude: "",//起始点经纬度
    startlongitude: "",
    endlatitude:"",//终点经纬度
    endlongitude:"",
    markers: [],
    circles: [],
    // locationValue:'',//用户输入的地址
    suggestion:"",//输入提示
    keyword:"",//用户输入的地址
    Height:""//用户设备高度
  },
  
  //导航按钮的点击事件即form的提交按钮
  //实现思路：
  //将获得的input值传入data中
  //判断用户是否只输入了文字但没有选择地点就点击导航按钮，如果是则提示用户,或者没有输入地址，也提示用户
  //调用封装好的openMap来进行导航
  getTraces:function(e){
   var keyword = e.detail.value.code.trim();//去左右空格
   this.setData({
    keyword:keyword//保存用户输入的地址
   });
  // console.log(this.data.longitude);
  if(this.data.endlongitude == "" || this.data.endlatitude == ""){//判断用户是否选择了地点
    if(this.data.keyword =="")//判断用户是否输入了值
    {
      wx.showModal({
        title:"温馨提示",
        content:"还没有输入地址哦"
      })
    }else{
      wx.showModal({
        title:"温馨提示",
        content:"还没有选择地址哦"
      })
    }
  }else{
    this.openMap();//设置导航
  }
  },

  //在用户点击了收缩建议列表后再次点击输入框，更改建议列表的wx：if使其可视化
  showSuggestion:function(e){
    if(this.data.keyword != ""){
      this.setData({
        cySuggestionShow:true
      })
    }
  },

  // 收缩按钮的点击事件
  // 实现思路：更改预先设定的控制wx:if的变量
  shrink:function(e){
    this.setData({
      cySuggestionShow:false
    })
  },

  //用户在输入框中输入数据时给用户显示地点建议
  //实现思路：
  // 使用qqmapsdk.getSuggestion 这个api用于返回建议，并将返回数据存放在data的数组数据中，最后在页面使用wx：for显示
  getsuggest: function(e) {
    var _this = this;
    var QQMapWX = require('../cySdkApi/qqmap-wx-jssdk.js');
    // 实例化API核心类
    var qqmapsdk = new QQMapWX({
        key: 'ZAFBZ-ADHLX-HSK4T-76RJF-T5CC6-EFFY3' // 必填
    });
    this.setData({
      cySuggestionShow:true,
      keyword:e.detail.value
    })
      //调用关键词提示接口
    qqmapsdk.getSuggestion({
      //获取输入框值并设置keyword参数
      keyword: e.detail.value, //用户输入的关键词，可设置固定值,如keyword:'KFC'
      //region:'北京', //设置城市名，限制关键词所示的地域范围，非必填参数
      success: function(res) {//搜索成功后的回调
        // console.log(res);
        var sug = [];//用于保存数据
        for (var i = 0; i < res.data.length; i++) {
          sug.push({ // 获取返回结果，放到sug数组中
            title: res.data[i].title,
            id: res.data[i].id,
            addr: res.data[i].address,
            city: res.data[i].city,
            district: res.data[i].district,
            latitude: res.data[i].location.lat,
            longitude: res.data[i].location.lng,
          });
        }
        _this.setData({ //设置suggestion属性，将关键词搜索结果以列表形式展示
          suggestion: sug
        });
      },
      fail: function(error) {
        // console.error(error);
      },
      complete: function(res) {
        // console.log(res);
      }
    });
},

//用户在点击某个建议后在地图上显示改地点并获取该地点的经纬度
backfill: function (e) {
  var id = e.currentTarget.id;
  for (var i = 0; i < this.data.suggestion.length;i++){
    if(i == id){
      this.setData({
        keyword: this.data.suggestion[i].title,
        startlatitude: this.data.suggestion[i].latitude,
        startlongitude: this.data.suggestion[i].longitude,
        endlatitude: this.data.suggestion[i].latitude,
        endlongitude: this.data.suggestion[i].longitude,
        cySuggestionShow:false,
        cyMarkers:[{
          id: "1",
          latitude: this.data.suggestion[i].latitude,
          longitude: this.data.suggestion[i].longitude,
          width: 50,
          height: 50,
        }]
      });
    }  
  }
 
},

//导航功能：使用wx.navigateTo
  openMap: function () {
    var that = this;
    let plugin = requirePlugin('routePlan');
    let key = 'ZAFBZ-ADHLX-HSK4T-76RJF-T5CC6-EFFY3';  //使用在腾讯位置服务申请的key
    let referer = 'wx1c68f58f95de88fd';   //调用插件的app的名称
    let endPoint = JSON.stringify({  //终点
      'name':this.data.keyword,
      'latitude':this.data.endlatitude,
      'longitude': this.data.endlongitude
    });
    wx.navigateTo({
      url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint
    });
    },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this;

    wx.getSystemInfo({
      
      success: function (res) {
        //设置map高度，根据当前设备宽高满屏显示
        that.setData({
          Height: res.windowHeight
        })

      }
    })
    //获取用户当前位置
    wx.getLocation({
      type: 'gcj02', // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标
      isHighAccuracy:true,
      success: function (res) {
      //  console.log(res);
        that.setData({
          startlatitude: res.latitude,
          startlongitude: res.longitude,
          circles: [{
            latitude: res.latitude,
            longitude: res.longitude,
            color: '#FF0000DD',
            fillColor: '#7cb5ec88',
            radius: 3000,
            strokeWidth: 1
          }]
        })
      // console.log(that.data.startlatitude);
      // console.log(that.data.startlongitude);
      },
      fail:function(e){
        // console.log(e);
      }
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})